
import React, { Component, lazy, Suspense } from 'react';
import { Switch,Route, Redirect,} from 'react-router-dom';
import Tabbar from '../components/Tabbar/Tabbar'
import img from '../assets/R-C.gif'
// 懒加载
var Home = lazy(() => import('./Index/Home'))
var Cate = lazy(() => import('./Index/Cate'))
var Shopcar = lazy(() => import('./Index/Shopcar'))
var Mine = lazy(() => import('./Index/Mine'))
var NotFound = lazy(() => import('./NotFound'))
class Index extends Component {
    render() {
        return (
            <div className='index'>
                <Suspense fallback={<div className='loading'><img src={img} alt="" /></div>}>
                    <Switch>
                        < Route path="/index/Home" component={Home} />
                        < Route exact path="/index/Cate" component={Cate} />
                        < Route exact path="/index/Shopcar" component={Shopcar} />
                        < Route exact path="/index/Mine" component={Mine} />
                        <Redirect exact from='/index' to="/index/home" />
                        <Route path="*" component={NotFound} />
                    </Switch>
                </Suspense>
                <Tabbar />
            </div>
        );
    }
}

export default Index;